<%- include head %>
<div id="index" style="width:100%;height:66px;background:#ded5de;box-shadow: 2px 2px #b5b0b0 ;">
      <div>
        <div class="navbar1">
            <div class="w_1">
                <div class="logo fl">
                    <a href="/index"><img src="/images/logo.png"></a>
                    <span style="font-size:22px;font-family:'kaiti'">健康公众号客服系统</span>
                  </div>
                  <div class="fr">
                    <ul class="navbar1">
                      <li><a href="/kefu/admin" style="color:black"><h4>在线解答<h4></a></li>
                      <li><a href="/question" style="color:black"><h4>问题咨询</h4></a></li>
                      <li><a href="/answer_all" style="color:black"><h4>群发消息</h4></a></li>
                      <li></li>
                      <li></li>
                      <li></li>
                      <li></li>
                      <li>用户名:<%=username %></li>
                      <li class="spacer"></li>
                      <li><a href="/login">退出</a></li>
                      </ul>
                  </div>
              </div>
        </div>
      <div class="main" style="width:90%;margin-left:5%;padding: 15px;padding:15px">
        <table class="table table-hover  table-bordered">
	      <thead>
	        <tr>
	          <th>序号</th>
	          <th>用户</th>
	          <th>问题</th>
            <th>留言时间</th>
	          <th>图片</th>
	          <th>其他</th>
	          <th>操作</th>
	        </tr>
	      </thead>
	      <tbody>
	        <tr v-for = "(item,index) in  allQuestionInfo">
	           <td>{{index+1}}</td>
	           <td>{{item.FromUserName}}</td>
             <td>{{item.Content}}</td>
             <td>{{item.CreateTime}}</td>
	           <td v-if="item.PicUrl==''" style="cursor:pointer">暂无图片</td>
             <td v-if="item.PicUrl!=''" v-on:click="choose_image(item.PicUrl)" style="cursor:pointer"><button class="btn btn-info">点击查看</button></td>
             <td v-if="item.MediaId==''" style="cursor:pointer">暂无其他内容</td>
	           <td v-if="item.MediaId!=''" v-on:click="choose_other(item.MediaId)" style="cursor:pointer"><button class="btn btn-info">点击查看</button></td>
	           <td v-on:click="choose_one(item.FromUserName,item.Content)" style="cursor:pointer"><button class="btn btn-primary">解答</button></td>
	        </tr>
	      </tbody>
	    </table>
      </div>
    <div v-show="toggleB">
    <div style="position:fixed;top:0;left:0;width:100%;height:100%;background:black;opacity:0.6" >
    </div>
    <div style="position:fixed;top:0;left:0;width:70%;height:500px;margin-left:15%;margin-top:100px;background:white;">
    <div style="float:right;margin-right:10px;margin-top:-13px;cursor:pointer" v-on:click="toggleB=false"><h3>X<h3></div>
    <div>
        <textarea style="width: 80%;height: 350px;max-width: 80%;max-height: 350px;margin-left:10%;margin-top:50px" placeholder="给用户解答留言" v-model="questionContent"></textarea>
    </div>
    <div>
        <button style="width: 100px;height: 50px;max-width: 100px;max-height: 50px;margin-left:80%;margin-top:10px" v-on:click="sendMessage()" class="btn btn-primary">发送</button>
    </div>
    </div>
    </div>
</div>
<script>
var allQuestionInfofromApi;
Vue.http.get('/api/admin_all_question_info_api')
      .then((response)=>{
            allQuestionInfofromApi = response.data;
            app._data.allQuestionInfo = allQuestionInfofromApi;
           // console.log(response);
          },(response)=>{
                alert("获取数据失败");
          })
var app = new Vue({
  el: '#index',
  data: {
    toggleUl: false,
    toggleB:false,
    questionContent:'',
    openId:'',
    content:'',
    allQuestionInfo:[
        { id:1,
          FromUserName:"",
          Content:"",
          CreateTime:'',
          PicUrl:'',
          MediaId:''
        }
    ]
  },
  methods:{
    choose_image:function(image){
       if(!image){
           alert("暂无图片")
       }else{
          window.open("http://read.html5.qq.com/image?src=forum&q=5&r=0&imgflag=7&imageUrl="+image.substring(7))
       }
    },
    choose_other:function(voice){
       if(!voice){
          alert("该用户没有留言其他类型内容！")
       } else{
          var postData={};
          postData.id = voice;
          this.$http.post('/api/admin_search_info_api',postData)
          .then((response)=>{
                console.log(response.data.msg);
                console.log(response.data.url)
                window.open(response.data.url)
              },(response)=>{
                alert("出错");
              })
       }
    },
    choose_one:function(name,con){
       this.toggleB = true;
       this.openId = name;
       this.content = con;
    },

    sendMessage:function(){
        var postData={};
        postData.content = '您的问题:'+this._data.content+'分析结果为:'+this._data.questionContent;
        postData.openId = this._data.openId;
        this.$http.post('/api/admin_answer_question_info_api',postData)
        .then((response)=>{
              alert(response.data.msg);
              if(response.data.status_code==1){
                 this.toggleB = false;
              }
            },(response)=>{
                  alert("回复出错");
            })
    }
  }
})
</script>

<%- include foot %>
